<template>
  <div class="flex flex-col h-full">
    <BaseTable
      :data-source="dataSource"
      column-code="00001117"
      :loading="loading"
      height="280"
      :extra-height="64"
      :row-class-name="(record) => (record.isNew ? 'table-row-new' : '')"
    >
      <template #bodyCell="{ column, index, record }">
        <template v-if="column.dataIndex === 'xh'">
          {{ index + 1 }}
        </template>
        <template v-if="column.dataIndex == 'ztflag'">
          <a-tag v-if="!record.ztflag" color="green">启用</a-tag>
          <a-tag v-else color="red">停用</a-tag>
        </template>
        <template v-if="column.dataIndex == 'isOnlineRegister'">
          <a-switch v-if="!record.isNew" :checked="record.isOnlineRegister" @change="onChangeSwitch(record)" />
        </template>
        <template v-if="column.dataIndex === 'ghfmc'">
          <EditCell title="挂号费别">
            <SelectTable v-model:value="record.ghfmc" type="挂号费别" @select="onSelectRegistration($event, record)" />
          </EditCell>
        </template>
        <template v-if="column.dataIndex === 'zlfmc'">
          <EditCell title="诊疗费别">
            <SelectTable v-model:value="record.zlfmc" type="诊疗费别" @select="onSelectDiagnosisFees($event, record)" />
          </EditCell>
        </template>
        <template v-if="column.dataIndex === 'outorder'">
          <EditCell title="顺序号">
            <a-input v-model:value="record.outorder" placeholder="请输入" @blur="editRow(record)" />
          </EditCell>
        </template>
        <template v-if="column.dataIndex === 'action'">
          <BaseButton confirm-text="确定删除？" type="text" danger size="small" @click="onHandleDelect(record)">删除</BaseButton>
          <a-divider v-if="!record.isNew" type="vertical" />
          <a-button v-if="record.ztflag && !record.isNew" type="link" size="small" @click="onHandleDeactivate(record, 0)">启用</a-button>
          <BaseButton v-if="!record.ztflag && !record.isNew" confirm-text="确定停用？" type="text" danger size="small" @click="onHandleDeactivate(record, 1)"
            >停用</BaseButton
          >
        </template>
      </template>
      <template #footer>
        <div class="text-center sticky bottom-0">
          <a-button class="mr-2" type="primary" ghost @click="addRow()"> 新增明细 </a-button>
          <a-button type="primary" :disabled="dataSource.length === 0" @click="saveNewRows()"> 保存 </a-button>
        </div>
      </template>
    </BaseTable>
  </div>
</template>

<script setup>
import { ref, watchEffect } from 'vue'
import { message } from 'ant-design-vue'
import BaseTable from '@/components/BaseTable'
import BaseButton from '@/components/BaseButton'
import { post } from '@/utils/request'
import EditCell from '@/components/EditCell'

const loading = ref(false)
const dataSource = ref([])
const editRow = (row) => !row.isNew && fetchSave(row)
const props = defineProps({
  userData: {
    type: Object,
    default: () => ({})
  }
})
const fetchSave = async (row) => {
  row.empId = props.userData?.empId
  row.isOnlineRegister = row?.isOnlineRegister ? 1 : 0
  const { code, msg } = await post('/operation/opex/doSaveEmpGHFB', row)
  if (code !== 0) return message.error(msg || '操作失败')
  getDetailData()
  message.destroy()
  message.success(row.isNew ? '新增成功' : '修改成功')
}

const saveNewRows = async () => {
  const newRow = dataSource.value.filter((item) => item.isNew)
  if (newRow.length === 0) return message.error('没有新增的数据')
  newRow.forEach((item) => {
    if (item.zlfbh && item.ghfbh) {
      fetchSave(item)
    } else {
      message.destroy()
      message.error('请填写完整信息')
    }
  })
}

//添加行
const addRow = () => {
  const key = `row-${dataSource.value.length}`
  const addRow = { key, isNew: true }
  dataSource.value.push(addRow)
}

const getDetailData = async () => {
  loading.value = true
  const { data, code } = await post('/operation/opex/getEmpGHFB', {
    empId: props.userData?.empId,
    pageNum: 1,
    pageSize: 999
  })
  loading.value = false
  if (code === 0) {
    dataSource.value = data
    const isOnline = data.filter((i) => i.isOnlineRegister === '1')
    if (!isOnline.length) {
      dataSource.value[0].isOnlineRegister = true
      fetchSave(dataSource.value[0])
    } else {
      isOnline[0].isOnlineRegister = true
    }
  }
}

// switch
const onChangeSwitch = async (row) => {
  row.isOnlineRegister = !JSON.parse(row.isOnlineRegister)
  dataSource.value.forEach((i) => {
    if (i.id !== row.id) {
      i.isOnlineRegister = false
    }
  })
  fetchSave({ ...row })
}

const onHandleDelect = async (row) => {
  if (row.id) {
    const { code, msg } = await post('/operation/opex/doDeleteEmpGHFB', row)
    if (code !== 0) return message.error(msg)
    message.success('删除成功')
    getDetailData()
  } else {
    dataSource.value = dataSource.value.filter((item) => {
      return item.key !== row.key
    })
    message.success('删除成功')
  }
}
//修改状态
const onHandleDeactivate = async (item, number) => {
  item.ztflag = number
  const { code, msg } = await post('/operation/opex/doUpdateEmpGHFB', item)
  if (code === 0) {
    message.success(msg)
    getDetailData()
  }
}
const onSelectRegistration = (row, record) => {
  record.ghfdj = row.dj
  record.ghfbh = row.bh
  record.ghfmc = row.mc
  if (record.zlfdj) {
    record.zfy = record.ghfdj + record.zlfdj
  }
  editRow(record)
}
const onSelectDiagnosisFees = (row, record) => {
  record.zlfdj = row.dj
  record.zlfbh = row.bh
  record.zlfmc = row.mc
  if (record.ghfdj !== '') {
    record.zfy = record.ghfdj + record.zlfdj
  }
  editRow(record)
}

watchEffect(() => {
  if (props.userData?.id) {
    getDetailData()
  }
})
</script>
<style lang="less" scoped>
:deep(.ant-card-head) {
  padding-left: 8px;
}
.text-right {
  .ant-input {
    text-align: right;
  }
}
</style>
